@(currentPage: Page[Product], currentSortBy: String, currentOrder: String, currentFilter: String)

@****************************************
* Helper generating navigation links    *
****************************************@
@link(newPage:Int, newSortBy:String) = @{

var sortBy = currentSortBy
var order = currentOrder

if(newSortBy != null) {
sortBy = newSortBy
if(currentSortBy == newSortBy) {
if(currentOrder == "asc") {
order = "desc"
} else {
order = "asc"
}
} else {
order = "asc"
}
}

// Generate the link
routes.ProductController.list(newPage, sortBy, order, currentFilter)

}

@**********************************
* Helper generating table headers *
***********************************@
@header(key:String, title:String, filter:Boolean) = {
<th class="@key.replace(".","_") header @if(currentSortBy == key) @{if(currentOrder == "asc") "headerSortDown" else "headerSortUp"}">
@if(filter==true){<a href="@link(0, key)">}
    @title
    @if(filter==true) {</a>}
</th>
}

@main {

<link rel="stylesheet" type="text/css" media="screen" href='@routes.Assets.at("stylesheets/order.css")'>

<h1 id="homeTitle">@Messages("Danh sách sản phẩm", currentPage.getTotalRowCount)</h1>

@if(flash.containsKey("success")) {
<div class="alert-message warning">
    <strong>Done!</strong> @flash.get("success")
</div>
}

<div id="actions">

    <form action="@link(0, "name")" method="GET">
    <input type="search" id="searchbox" name="f" value="@currentFilter" placeholder="Lọc theo tên...">
    <input type="submit" id="searchsubmit" value="Tìm kiếm" class="btn primary">
    </form>

    <a class="btn success" id="add" href="@routes.ProductController.create()">Thêm sản phẩm</a>

</div>

@if(currentPage.getTotalRowCount == 0) {

<div class="well">
    <em>Nothing to display</em>
</div>

} else {

<table class="computers zebra-striped">
    <thead>
    <tr>
        @header("code", "Mã sản phẩm ", true)
        @header("name", "Tên sản phẩm", true)
        @header("name", "Khách hàng", true)
    </tr>
    </thead>
    <tbody>

    @for(product <- currentPage.getList) {
    <tr>
        <td>
            @if(product.code == null) {
            <em>-</em>
            } else {
            @product.code
            }
        </td>
        <td>
            @if(product.name == null) {
            <em>-</em>
            } else {
            @product.name
            }
        </td>
        <td>
            @if(product.name == null) {
            <em>-</em>
            } else {
            @product.customer
            }
        </td>
    </tr>
    }

    </tbody>
</table>

<div id="pagination" class="pagination">
    <ul>
        @if(currentPage.hasPrev) {
        <li class="prev">
            <a href="@link(currentPage.getPageIndex - 1, null)">&larr; Trước</a>
        </li>
        } else {
        <li class="prev disabled">
            <a>&larr; Previous</a>
        </li>
        }
        <li class="current">
            <a>Hiển thị từ @currentPage.getDisplayXtoYofZ(" tới "," của ")</a>
        </li>
        @if(currentPage.hasNext) {
        <li class="next">
            <a href="@link(currentPage.getPageIndex + 1, null)">Sau &rarr;</a>
        </li>
        } else {
        <li class="next disabled">
            <a>Next &rarr;</a>
        </li>
        }
    </ul>
</div>

}

}

